<script lang="tsx">
  import HelloWorld from "./components/HelloWorld.vue";
  import VueSvg from "@/assets/svgs/vue.svg";

  import dayjs from "dayjs";
  import "dayjs/locale/es";
  import { ref, h, defineComponent } from "vue";

  dayjs.locale("es");
  const baseUrl = import.meta.env.VITE_IMG_BASE_URL;

  const icons = import.meta.glob("./assets/svgs/vite*.svg");
  const l = ref([] as any[]);

  const a = dayjs("2018-05-05").locale("zh-cn").format();
  console.log(a);
  // Object.values(icons).map((o) => {
  //   o().then((r: any) => {
  //     l.value.push(r.render);
  //   });
  // });

  const iconUrls = Object.keys(icons).map((key: any) => {
    const fileName = key.split("/").pop();
    const [svgName] = fileName.split(".");
    return svgName;
  });

  export default defineComponent({
    setup() {
      return () => {
        return (
          <div>
            {iconUrls.map((item) => (
              <Svg-Icon name={item} width="50" height="50" />
            ))}

            <img
              src={baseUrl + "v3-order-reg-confirm.png"}
              class="logo"
              alt="Vite logo"
            />
          </div>
        );
      };
    },
  });
</script>

<style scoped>
  .logo {
    height: 6em;
    padding: 1.5em;
    will-change: filter;
    transition: filter 300ms;
  }
  .logo:hover {
    filter: drop-shadow(0 0 2em #646cffaa);
  }
  .logo.vue:hover {
    filter: drop-shadow(0 0 2em #42b883aa);
  }
</style>
